<!--
 * @Descripttion: 
 * @version: 
 * @Author: ewgof
 * @Date: 2020-08-31 23:14:48
 * @LastEditors: ewgof
 * @LastEditTime: 2020-09-05 12:55:43
-->
<!-- 内容部分 -->
<div id="container">
    <div class="layui-container">
        <div class="layui-row">
            <div class="layui-col-lg4 layui-col-md-offset4">
                <!-- 登录表单 -->
                <div class="login layui-form">
                    <h5 style="padding-bottom:0.6em;color:#FFFFFF;">用户名: </h5>
                    <div class="layui-form-item">
                        <input id="username" type="text" name="username" lay-verify="username" placeholder="用户名"
                            autocomplete="on" class="layui-input">
                    </div>
                    <h5 style="padding-bottom:0.6em;color:#FFFFFF;">密码: </h5>
                    <div class="layui-form-item">
                        <input id="password" type="password" name="password" lay-verify="password" placeholder="密码"
                            autocomplete="off" class="layui-input">
                    </div>
                    <h5 style="padding-bottom:0.6em;color:#FFFFFF;"> </h5>
                    <div class="layui-form-item">
                        <button class="layui-btn" lay-submit lay-filter="register">注册</button>
                    </div>
                    <!-- <div class="layui-form-item">
                            <label for="" class="layui-form-label">

                            </label>
                        </div> -->
                    <div class="layui-form-mid layui-word-aux">
                        已有账号？点击<a href="javascript:;" onclick="switchMainPage('login')" style="color: white;">登录</a>
                    </div>
                </div>
                <!-- 登录表单END -->
            </div>
        </div>
    </div>
</div>
<!-- 内容部分end -->

<script src="./static/js/jquery.base64.js"></script>

<script>
    if (!window.btoa) window.btoa = $.base64.btoa
    if (!window.atob) window.atob = $.base64.atob

    layui.use('form', function () {
        var layer = layui.layer,
            form = layui.form;

        form.verify({
            username: function (val) {
                if (!val) {
                    return '用户名不能为空';
                }
                if (val.length < 2 || val.length > 50) {
                    return '用户名介于 2 个字符50个字符之间';
                }
            },
            password: function (val) {
                if (!val) {
                    return '密码不能为空';
                }
                if (!window.config.reg.passwd.test(val)) {
                    return '密码由8-16个数字/字母组成';
                }
            }
        });

        form.on('submit(register)', function (data) {
            var data = data.field;
            // console.log(data);
            $.ajax({
                url: window.config.api_url + 'api/register',
                method: 'post',
                data: { username: $.base64.btoa(data.username), password: $.base64.btoa(data.password)},
                dataType: 'json',
                processData: true,
                cache: false,
                headers: { rtime: window.func.getTime() },
                success: function (res) {
                    if (res.code == 0) {
                        var icon = 1;
                        $('#section').load('./login.html');
                    } else {
                        var icon = 2;
                    }
                    layer.msg(res.msg, {time: 1000, icon: icon});
                },
                fail: function () {
                    window.func.error();
                }
            });

            return false;
        });
        return false;
    });
</script>